<?php get_header(); ?>
<style>
    body{
        background: #0d398e;
    }
</style>
<div class="contact">
    <img src="<?php asset('statics/css/img/contactbg.png'); ?>" class='contactbg' alt="">
    <div class="beijing address"><span class="axis"></span></div>
    <div class="taibei address"><span class="axis"></span></div>
    <div class="meiguo address"><span class="axis"></span></div>
</div>
<div class="contact-text">
    <?php $mypost = array( 'post_type' => 'type_contact');$loop = new WP_Query( $mypost ); ?>
    <?php  if ( have_posts() ) : while ( $loop->have_posts() ) : $loop->the_post();?>
        <div class="databox" id="box-<?php echo get_post_meta($post->ID, "contact_setting_id", $single = true) ?>">
            <h3 class="name-en"><?php echo get_post_meta($post->ID, "contact_setting_title_en", $single = true) ?></h3>
            <h3 class="name-cn"><?php the_title(''); ?></h3>
            <p class="email"><?php echo get_post_meta($post->ID, "contact_setting_email", $single = true) ?></p>
            <p class="addre">
                <?php if(qtrans_getLanguage()=='tw'): ?>
                    <?php echo get_post_meta($post->ID, "contact_setting_address_tw", $single = true) ?>
                <?php endif; ?>
                <?php if(qtrans_getLanguage()=='en'): ?>
                    <?php echo get_post_meta($post->ID, "contact_setting_address_en", $single = true) ?>
                <?php endif; ?>
                <?php if(qtrans_getLanguage()=='zh'): ?>
                    <?php echo get_post_meta($post->ID, "contact_setting_address_cn", $single = true) ?>
                <?php endif; ?>
            </p>
        </div>
    <?php endwhile; ?>
    <?php endif; wp_reset_query(); ?>
</div>
<?php get_footer(); ?>
<script>
    var axis1 = $('.beijing .axis');
    var axis2 = $('.taibei .axis');
    axis1.on('click',function(){
        $('.axis').removeClass('axishot');
        $(this).addClass('axishot');
        $('.databox').removeClass('databoxhot');
        $('#box-bj').addClass('databoxhot');
    })
    $('#box-bj').click(function(){
        $('.databox').removeClass('databoxhot');
        $('#box-bj').addClass('databoxhot');
        $('.axis').removeClass('axishot');
        axis1.addClass('axishot');
    })
    axis2.on('click',function(){
        $('.axis').removeClass('axishot');
        $(this).addClass('axishot');
        $('.databox').removeClass('databoxhot');
        $('#box-tw').addClass('databoxhot');
    })
    $('#box-tw').click(function(){
        $('.axis').removeClass('axishot');
        axis2.addClass('axishot');
        $('.databox').removeClass('databoxhot');
        $('#box-tw').addClass('databoxhot');
    })

</script>
</body>
</html>